<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>创建用户</title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="description" content="This is my page">
		<!-- Add by Kravis Liu 2014.09.22 -->
		<link rel="stylesheet" href="/css/base.css" />
		<link rel="stylesheet" href="/css/form.css" />
		<link rel="stylesheet" media="screen" href="/css/validate.css">
		<script src="/js/jquery-1.11.1.min.js"></script>	
		<script src="/js/jqueryValidation/jquery.validate.min.js"></script>	
		<script src="/js/jqueryValidation/additional-methods.js"></script>	
		<script type="text/javascript">
			 
			function register(){	
				$("#createUserForm").submit();
			}
			
			
			$(document).ready(function(){
	        
			        $("#createUserForm").validate({
					rules: {
						username: {
						        phone:true,
							required: true
						},
						password: {
							required: true
						},
						phone: {
						        phone:true,
						        required: true
						},
						email: {
							required: true,
							email: true
						},
						school: {
						        required: true
						},
						nickname: {
						        required: true
						},
					},
					messages: {
						username: {
						         phone:"用户姓名应为手机号码！" ,
							required: "请输入用户名！"
						},
						password: {
							required: "请输入密码！"
						},
						phone: {
						        required: "请输入手机号码！",
						        phone:"请输入正确的手机号码！" 
						},
						email: {
						        required: "请输入邮箱地址！",
						        email:"请输入正确的邮箱地址!"
						},
						realname: {
						        required: "请输入真实姓名！"
						},
						nickname: {
						        required: "请输入昵称！"
						},
					},
					submitHandler:function(form){
		                            form.submit();
		                        }
				});
			        
			        
			    });
		
				function showImg(fileid) {  
					var reader = new FileReader();  
					var picpreview=document.getElementById("preview");    
					reader.onload = function(e) {  
						var img = $("#photoImg");
						img.attr("src",this.result); 
					}
					reader.readAsDataURL(document.getElementById(fileid).files[0]);  
				}		
		</script>
		
	</head>
	<body >	
		<div id="page">
			<div id="header">
				<h4>后台管理</h4>
			</div>
			<form enctype="multipart/form-data" method="post" id="createUserForm" action="/app/createUser">
				  <p>
					<label>用户类型：</label>
					<select name="usertype" id="usertype">
						<option value="0">普通用户</option>	
						<option value="1">活动员</option>	
					</select>
					
				  </p>
				  <p>						
					<label>用户状态：</label>
					<select name="usable" id="usable">
						<option value="1">启用</option>
						<option value="0">停用</option>
					</select>
					
				  </p>
				  <p>
					<label>头像：</label>
					<img id="photoImg" src="" style="width: 179px; height: 189px;"/>
					</p>
					<input type="file" id="photoFile" name="photoFile" onchange="showImg(this.id);">
					
				  </p>
				  <p>
					<label>用户名：</label>
					<input type="text" name="username" id="username" />
					
				  </p>
				  <p>
					<label>密码： </label>
					<input type="text" name="password" id="password" />
					
				  </p>
				  <p>
					<label>手机号：</label>
					<input type="text" name="phone" id="phone" />
					
				  </p>
				  <p>
					<label>邮箱：</label>
					<input type="text" name="email" id="email" />
				  </p>
				  <p>
					<label>昵称：</label>
					<input type="text" name="nickname" id="nickname" />
				  </p>

				  <p>
					<input class="change" type="button" onclick="register();" value="提交" />
				  </p>
				
			</form>
			
			<div id="footer">
				<a style="float:right;margin:5px" href="/logout">退出</a>
				<a style="float:right;margin:5px" href="/app/index">主页</a>
			</div>
		</div>
	</body>
</html>
